<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" :width="600" destroy-on-close @closed="$emit('closed')">
		<el-form :model="taskInfo" :rules="rules" ref="dialogForm" label-width="150px" label-position="left">
			<el-form-item label="任务名称" prop="taskName">
				<el-input v-model="taskInfo.taskName" placeholder="定时任务名称" clearable></el-input>
			</el-form-item>

			<el-form-item label="任务分组" prop="taskGroup">
				<el-input v-model="taskInfo.taskGroup" placeholder="定时任务分组名称" clearable></el-input>
			</el-form-item>

			<el-form-item label="任务参数">
				<el-input v-model="taskInfo.args" placeholder="定时任务参数(如果任务类型为HTTP，则参数为body)"
						  clearable></el-input>
			</el-form-item>

			<el-form-item label="超时时间" prop="timeout">
				<el-input v-model="taskInfo.timeout" placeholder="任务执行超时时间(单位秒),0不限制"
						  clearable></el-input>
			</el-form-item>

			<el-form-item label="重试次数" prop="retryTimes">
				<el-input v-model="taskInfo.retryTimes" placeholder="任务失败重试次数" clearable></el-input>
			</el-form-item>

			<el-form-item label="重试间隔时间" prop="retryInterval">
				<el-input v-model="taskInfo.retryInterval" placeholder="任务失败重试间隔时间" clearable></el-input>
			</el-form-item>

			<el-form-item label="任务类型" prop="tag">
				<el-select v-model="taskInfo.tag" clearable>
					<el-option label="内部函数" value="internalFuncTask"></el-option>
					<el-option label="HTTP" value="httpTask"></el-option>
					<el-option label="shell" value="shellTask"></el-option>
				</el-select>
			</el-form-item>

			<el-form-item v-if="taskInfo.tag === 'internalFuncTask'" label="调用函数名" prop="invokeTarget">
				<el-input v-model="taskInfo.invokeTarget" placeholder="内部函数任务函数名" clearable></el-input>
			</el-form-item>

			<el-form-item v-if="taskInfo.tag === 'httpTask'" label="HTTP类型" prop="httpMethod">
				<el-select v-model="taskInfo.httpMethod" clearable>
					<el-option label="GET" value="GET"></el-option>
					<el-option label="POST" value="POST"></el-option>
				</el-select>
			</el-form-item>

			<el-form-item label="定时规则" prop="cronExpression">
				<sc-cron v-model="taskInfo.cronExpression" placeholder="请输入Cron定时规则" clearable
						 :shortcuts="shortcuts"></sc-cron>
			</el-form-item>

			<el-form-item label="任务描述">
				<el-input v-model="taskInfo.remark" placeholder="请输入任务描述信息" clearable></el-input>
			</el-form-item>

			<el-form-item label="是否启用" prop="status">
				<el-switch v-model="taskInfo.status" active-value=1 inactive-value=0></el-switch>
				<el-switch v-model="taskInfo.multi" active-value=1 inactive-value=0></el-switch>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="visible=false">取 消</el-button>
			<el-button type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
		</template>
	</el-dialog>
</template>

<script>
import scCron from '@/components/scCron';

export default {
	components: {
		scCron
	},
	emits: ['success', 'closed'],
	data() {
		return {
			mode: "add",
			titleMap: {
				add: '新增计划任务',
				edit: '编辑计划任务'
			},
			taskInfo: {
				taskName: "",
				taskGroup: "",
				cronExpression: "",
				tag: "",
				invokeTarget: "",
				args: "",
				httpMethod: "",
				timeout: 0,
				retryTimes: 0,
				status: 1,
				retryInterval: 0,
				remark: "",
				multi: 1
			},
			rules: {
				taskName: [
					{required: true, message: '请填写任务名称'}
				],
				taskGroup: [
					{required: true, message: '请填写任务分组'}
				],
				cronExpression: [
					{required: true, message: '请填写定时规则'}
				],
				tag: [
					{required: true, message: '请选择任务类型'}
				],
				invokeTarget: [
					{required: true, message: '请输入调用函数名'}
				],
				httpMethod: [
					{required: true, message: '请选择HTTP请求类型'}
				],
				timeout: [
					{required: true, message: '请输入任务超时时间'}
				],
				retryTimes: [
					{required: true, message: '请输入任务失败重试次数'}
				],
				retryInterval: [
					{required: true, message: '请输入任务失败重试间隔时间'}
				],
			},
			visible: false,
			isSaveing: false,
			shortcuts: [
				{
					text: "每天8点和12点 (自定义追加)",
					value: "0 0 8,12 * * ?"
				}
			]
		}
	},
	mounted() {

	},
	methods: {
		//显示
		open(mode = 'add') {
			this.mode = mode;
			this.visible = true;
			return this;
		},
		//表单提交方法
		async submit() {
			this.$refs.dialogForm.validate(async (valid) => {
				if (valid) {
					this.isSaveing = true;
					let res = await this.$API.system.Tasks.createSysTask.post({taskInfo: this.taskInfo})
					if (res.code === 0) {
						this.$message.success("创建成功")
					} else {
						this.$message.error(res.message)
					}
					this.isSaveing = false;
				}
			})
		},
		//表单注入数据
		setData(data) {
			this.form.id = data.id
			this.form.title = data.title
			this.form.handler = data.handler
			this.form.cron = data.cron
			this.form.state = data.state
		}
	}
}
</script>

<style>
</style>
